<template>
  <view class="empty-container">
    <image class="empty-img" src="/static/empty-diary.png" mode="aspectFit" />
    <view class="empty-text">还没有日记哦~</view>
    <button class="empty-btn" @click="goPublish">去发布日记</button>
  </view>
</template>
<script lang='ts' setup>

const goPublish = () => {
  uni.switchTab({ url: '/pages/diary/index' })
}
</script>
<style lang='scss' scoped>
.empty-container {
  width: 100%;
  min-height: 400rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60rpx 0 40rpx 0;
  box-sizing: border-box;
}
.empty-img {
  width: 180rpx;
  height: 180rpx;
  margin-bottom: 32rpx;
  opacity: 0.8;
}
.empty-text {
  font-size: 30rpx;
  color: #b0b0b0;
  margin-bottom: 32rpx;
}
.empty-btn {
  background: linear-gradient(90deg, #eaac45 0%, #f5d08a 100%);
  color: #fff;
  border: none;
  border-radius: 32rpx;
  padding: 0 48rpx;
  height: 64rpx;
  font-size: 28rpx;
  box-shadow: 0 4rpx 12rpx rgba(234,172,69,0.12);
}
</style>